<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<span>

    <head>
        <meta charset="UTF-8">
        <title>资讯详情页</title>
        <meta name="page-view-size" content="1280*720">
        <link rel="stylesheet" href="../css/base.css">
        <!-- <link rel="stylesheet" href="../css/detailPage.css"> -->
        <script type="text/javascript" src="../lib/js/evm.js"></script>
        <script type="text/javascript" src="../lib/js/Evm_djyw.js"></script>
        <script type="text/javascript" src="../lib/js/key.js"></script>
        <script src="../lib/js/jquery-1.11.1.min.js" type="text/javascript" charset="utf-8"></script>
        <script src="../lib/js/jquery.cookie.js" type="text/javascript" charset="utf-8"></script>
        <script src="../js/api.js" type="text/javascript" charset="utf-8"></script>
        <script src="../js/public.js" type="text/javascript" charset="utf-8"></script>
        <script src="../lib/js/md5.js" type="text/javascript" charset="utf-8"></script>
        <style>
            .articleDetail-bg {
                width: 1280px;
                height: 720px;
                background: url(../images/bg.png) no-repeat left top;

            }

            .model {
                box-sizing: border-box;
                border: 3px solid transparent;
            }

            #articleDetailBody {
                position: absolute;
                top: 150px;
                left: 80px;
                width: 1121px;
                height: 481px;
                background: rgba(0, 0, 0, .3);
                border-radius: 15px;
                color: white !important;
            }

            #modelImg {
                top: 110px;
                left: 40px;
                width: 293px;
                height: 166px;
                border: 3px solid rgba(255, 255, 255, 0.2);
                position: relative;
                float: left;
            }

            #modelImg>.alearts {
                position: absolute;
                width: 100%;
                text-align: center;
                font-size: 20px;
                background: rgba(0, 0, 0, 0.7);
                height: 40px;
                line-height: 40px;
                bottom: 0;
                color: white;
                display: none;
            }

            #modelImg>img {
                height: 100%;
                width: 100%;
            }

            .active,
            #modelImg.active {
                border: solid 4px lightgreen !important;
            }

            .ell {
                font-size: 24px;
                color: white;
                white-space: normal;
            }

            #detailContain {
                color: 333;
                line-height: 35px;
                font-size: 20px;
                position: absolute;
                top: 110px;
                left: 376px;
                width: 700px;
                height: 350px;
                overflow: hidden;
                border-radius: 10px;
                text-indent: 1rem;
            }

            .title {
                width: 100%;
                font-size: 30px;
                line-height: 50px;
                top: 5px;
                position: absolute;
                /* left: 287px; */
                /* border: 1px solid red; */
                text-align: center
            }

            .detailRow {
                width: 100%;
                overflow: hidden;
                margin-bottom: 6px;
            }

            .detailRow>span:first-child {
                font-size: 24px;
                width: 140px;
                font-weight: bold;
                color: #Fdd000;
                line-height: 36px;
                /* letter-spacing: 1px; */
            }

            .conItems {
                float: right;
                width: 554px;
            }

            .w2 {
                letter-spacing: 1.5rem;
                margin-right: -1.5rem;
            }

            .w3 {
                letter-spacing: .5rem;
                margin-right: -.5rem;
            }

            #modelCur {
                position: absolute;
                text-align: center;
                line-height: 40px;
                color: #fff;
                width: 293px;
                height: 54px;
                /* background: #F98C2E; */
                border-radius: 10px;
                font-size: 28px;
                top: 290px;
                left: 40px;
            }

            #modelJilu {
                width: 293px;
                height: 54px;
                border: 1px solid;
                width: 293px;
                height: 54px;
                border: 1px solid transparent;
                font-size: 28px;
                text-align: center;
                color: white;
                /* background: #F98C2E; */
                border-radius: 10px;
                line-height: 40px;
                position: absolute;
                top: 360px;
                left: 40px;
            }

            #modelCur>div {
                width: 90%;
                height: 80%;
                /* position: absolute; */
                margin: 5px auto;
                background: #F98C2E;
                border-radius: 15px;
            }

            #modelJilu>div {
                width: 90%;
                height: 80%;
                /* position: absolute; */
                margin: 5px auto;
                background: #F98C2E;
                border-radius: 15px;
            }

            /* .model:last-child.active {
            border: 3px solid #fff;
        } */
        </style>
    </head>

    <body>
        <div class="articleDetail-bg" id="articleDetailMain">

            <div id="articleDetailBody">
                <div class="title">
                </div>
                <div class="model" id="modelImg">
                    <img class="imgs" src="" alt="">
                    <div class="alearts">按确认键查看图集</div>
                </div>
                <div class="model" id="detailContain">
                    <div class="container" id="detail">
                        <div class="content" id="content">
                        </div>
                    </div>
                </div>
                <div class="model" id="modelCur">
                    <div> <span id="numberCur">我要点单</span></div>
                </div>
                <div class="model" id="modelJilu">
                    <div>点单记录</div>
                </div>
            </div>

        </div>
    </body>
    <script>
        isCache = false;
        var modelIndex = {
            disUser: true,
            index: 1, //初始位置
            listName: 'model', //模块名称
            containerId: 'articleDetailBody', //包含模块的标签id
            thisContain: 'detailContain', //翻滚外容器
            thisDetail: 'detail', //翻滚内容
        }


        TV.structure('志愿服务')

        var articleRun;
        var photos;

        function direOpt(index, directive) {
            if (directive == "up") { //上
                if (index == 1) { //文章翻滚
                    TV.articleMove(directive, modelIndex.thisContain, modelIndex.thisDetail);
                } else if (index == 3) {
                    index = 2;
                }
                // else if (index == 2) {
                //     index = 0;
                // }


            } else if (directive == "down") { //下
                if (index == 1) { //文章翻滚
                    TV.articleMove(directive, modelIndex.thisContain, modelIndex.thisDetail);
                }
                // else if (index == 0) {
                //     index = 2;
                // }
                else if (index == 2) {
                    index = 3;
                }
            } else {
                if (directive == "backwards" && index == 1) {
                    index = 2;
                } else {
                    index = 1
                }

                // index = index == 0 ? 1 : 0;
                clearInterval(articleRun);
            }
            return index;
        }

        function getMessage() {
            var param = {
                id: TV.GetParam('id'),
                // area_id: $.cookie('TV_CST_AREA')
            }
            GetDatas('assistDetail', param, function (err, res) {
                var mess = res.data.assist;
                photos = mess.photos;
                ctitle = mess.title;
                console.log(mess)
                var str = ''
                str += ' <p class="detailRow">'
                str += '<span >服务项目：</span>'
                str += '<span class="ell" >' + mess.title + '</span>'
                str += '</p>'
                str += ' <p class="detailRow">'
                str += '<span class="w3">联系人：</span>'
                str += '<span class="ell">' + mess.contacter + '</span>'
                str += '</p>'
                str += ' <p class="detailRow">'
                str += '<span>联系方式：</span>'
                str += '<span class="ell">' + mess.mobile + '</span>'
                str += '</p>'
                str += ' <p class="detailRow">'
                str += '<span class="w2">地址：</span>'
                str += '<span class="ell">' + mess.address + '</span>'
                str += '</p>'
                str += ' <p class="detailRow">'
                str += '<span>团队名称：</span>'
                str += '<span class="ell">' + mess.team + '</span>'
                str += '</p>'
                $('.content').html(str);
                $('.title').html(mess.title)
                $('.time').html(mess.format_add_time)
                // $('#numberCur').html(mess.click_count)
                if (mess.img) {
                    $('.imgs').attr('src', API_URL['imgURL'] + mess.img);
                } else {
                    $('.imgs').attr('src', '../images/base1.jpg');
                }

            })
        }
        getMessage();

        function direEnter(index) {
            console.log()
            if (index == 0) {
                // alert(index)
                if (photos && photos.length) {

                    window.location.href = './carrousel.html?id=' + TV.GetParam('id');
                }

            } else if (index == 1) {
                clearInterval(articleRun);
            } else if (index == 2) {
                var nick_name = $.cookie('TV_CST_NAME');
                var access_token = $.cookie('TV_CST_TOKEN');
                var phone = $.cookie('TV_CST_MOBILE');
                // alert(ctitle)
                function prompt1(title) {
                    str = '<div class="tishi" style="font-size: 30px;z-index: 1111;text-align: ' +
                        'center;width: 370px;height: 50px;position: absolute;background: white;padding: 50px;border-radius: 20px;top: 270px;left: 436px;color: black;">' +
                        title +
                        '</div>';
                    $("body").append(str);
                    setTimeout(function () {
                        $('.tishi').hide()
                    }, 2000);
                };
                var param = {
                    access_token: access_token,
                    brief: nick_name + '发布了' + ctitle,
                    id: TV.GetParam('id'),

                }
                GetDatas('dianDan', param, function (err, res) {
                    // TV.PromptMsg(res.code)
                    if (res.code == 0) {

                        TV.PromptMsg("点单成功")
                    } else if (res.code == 10009) {
                        TV.userLogin();
                        direEnter(index);
                    } else if (res.code == 10002) {
                        prompt1("请登录")
                        setTimeout(function () {
                            window.location.href = 'login.html'
                        }, 1000);
                    } else {
                        var message = res.message
                        prompt1(message)
                    }
                })

                // TV.PromptMsg('点赞成功')
                // $('#numberCur').html(parseInt($('#numberCur').html()) + 1)
            } else {
                window.location.href = './diandanRecord.html?id=' + TV.GetParam('id');
            }
        }
    </script>
    <script type="text/javascript" src="../js/index.js"></script>

</span>